<template>
  <div v-if="isShow">
    <el-dialog
      title="审核"
      :visible="descsShow"
      size="small"
      :before-close="hideModalAlert"
    >
      <div>
        <table class="desc">
          <tbody>
            <tr>
              <td>区域：{{data.areaTeamName}}</td>
              <td>期数：{{data.periodName}}</td>
              <td>业务组：{{data.busTeamName}}</td>
            </tr>
            <tr>
              <td>年级：{{data.gradeName}}</td>
              <td>科目：{{data.subjectName}}</td>
              <td>层级：{{data.level | getRegLevelVal}}</td>
            </tr>
            <tr>
              <td>班级名称：{{data.className}}</td>
              <td>开课日期：{{data.startCourseTime | formatDate}}</td>
              <td>开课时间：{{data.studyingTime}}</td>
            </tr>
            <tr>
              <td>主讲老师：{{data.teacherName}}</td>
            </tr>
            <tr>
              <td
                colspan="3"
                class="applyReason"
              >增开原因：{{data.applyReason}}</td>
            </tr>
          </tbody>
        </table>
        <div class="baseText">
          <div>基础指标：</div>
          <div>
            <ul>
              <li>同类别级班级数量：{{base.classNum}}</li>
              <li>同类别班级报读人数之和：{{base.regNum}}</li>
              <li>同类别班级平均满班率：{{`${Number(base.classNum) ? (base.regNum/(base.classNum *28)*100).toFixed(2) : 0}%`}}</li>
            </ul>
          </div>
        </div>
        <div
          class="checkBtns"
          v-if="mode==='check'"
        >
          <div>
            <el-button
              type="primary"
              @click="checkPass"
            >审核通过</el-button>
            <el-button @click="checkNoPass">审核不通过</el-button>
          </div>
        </div>
      </div>
    </el-dialog>
    <el-dialog
      :title="`${passType == 'yes'? '审核通过理由':'审核不通过理由'}`"
      :visible="isPassShow"
      size="small"
      :before-close="hideModalAlert"
    >
      <el-input
        v-model="passReason"
        placeholder="请输入理由"
      ></el-input>
      <div class="noPassBtns">
        <el-button
          type="primary"
          class="n_sure"
          @click="passReasonBtn"
        >确定</el-button>
      </div>

    </el-dialog>
  </div>
</template>
<script>
import io from '../../../lib/io'
import myMixin from '../../base/mixins.js'
import { regLevels } from '../../../lib/global/index.js'
import moment from 'moment'

export default {
  data() {
    return {
      descsShow: true,
      isPassShow: false,
      passReason: '',
      regLevels,
      ischeckModal: false,
      passType: '',
      checkPeriodIds: [],
      segmentsList: [],
    }
  },
  props: ['data', 'isShow', 'mode', 'base','inProveModal'],
  created() {
  },
  mixins: [myMixin],
  components: {
  },
  computed: {
    busTeams: function() {
      return this.checkFormModel.areaTeamId
        ? this.$root.config.groupBusTeams[this.checkFormModel.areaTeamId] || []
        : []
    },
    campusTeams: function() {
      this.$root.config.campusList = this.$root.config.campusList || []
      return this.checkFormModel.areaTeamId
        ? (this.$root.config.campusList.length > 0 &&
            this.$root.config.campusList.filter(
              val => val.areaTeamId === this.checkFormModel.areaTeamId
            )) ||
            []
        : []
    }
  },
  watch: {
  },
  methods: {
    checkPass() {
      this.descsShow = false
      this.isPassShow = true
      this.passType = 'yes'
      // this.ischeckModal = true
    },
    hideModalAlert() {
      this.$emit('checkModalClose')
    },
    passReasonBtn() {
      let passApi = ''
      if (this.passType !== 'yes') {
        passApi = io.auditFailureApplyClass
      } else {
        passApi = io.auditSuccessApplyClass
      }
      io.post(
        passApi,
        {
          auditReason: this.passReason,
          applyClassId: this.data.applyClassId
        },
        ret => {
          if (ret.success) {
            this.hideModalAlert()
            this.$alert('添加成功')
          } else {
            this.$alert(ret.desc)
          }
        }
      )
    },
    checkNoPass() {
      this.descsShow = false
      this.isPassShow = true
      this.passType = 'no'
    }
  }
}
</script>
<style lang="less" scoped>
.desc {
  tr {
    height: 50px;
  }
}
.baseText {
  color: red;
  display: flex;
}
.applyReason {
  word-break: break-all;
}
.checkBtns {
  margin-top: 30px;
  width: 100%;
  > div {
    width: 210px;
    margin: 0 auto;
  }
}
.noPassBtns {
  width: 100%;
  .n_sure {
    margin: 20px auto 0 auto;
  }
}
</style>


